import React, { useState, useEffect } from "react";
import { NumText, StatusText } from "@/pages/OrderModule/common/components/CommonText";
import styles from "../component/index.module.less";
import CommonZjfImg from "@/views/components/CommonZjfImg";

export default ({}) => {
	const defaultColumns = [
		{
			name: "系统商品名称",
			code: "skuName",
			width: 300,
			render: (text, record) => {
				return (
					<div className={styles.goodsBox}>
						<div className={styles.goodsImg}>
							<img src={record.skuImage} />
						</div>
						<div className={styles.goodsContent}>
							<div className="textOverflowMultiTwo">{record.skuName}</div>
							<div className="textOverflowMultiOne">{record.skuSpec}</div>
							<div>
								<span>商品编码：</span>
								<span>{record.skuCode}</span>
							</div>
						</div>
					</div>
				);
			}
		},
		{
			name: "供应商",
			code: "supplierName"
		},
		{
			name: "供应商商品名称",
			code: "supplierSkuName",
			width: 250,
			render: (text, record, index) => {
				return <div>{goodsNameRender(record, index)}</div>;
			}
		},
		{
			name: "退货单价",
			code: "batchUnitPrice",
			render: value => <NumText as="s1" pre={value ? "¥ " : ""} num={value ? value.toFixed(2) : ""} />
		},
		{
			name: "退货总数",
			code: "returnTotalNum"
		},
		{
			name: "已退数",
			code: "returnedNum"
		},
		{
			name: "未退数",
			code: "noReturnedNum"
		},
		{
			title: "实际退货金额",
			code: "actualRefundAmount",
			render: value => <NumText as="s1" type="error" num={value ? value.toFixed(2) : 0} />
		},
		{
			title: "退货总额",
			code: "totalRefundAmount",
			render: value => <NumText as="s1" pre={value ? "¥ " : ""} num={value ? value.toFixed(2) : 0} />
		},
		{
			name: "拒退数量",
			code: "rejectedQuantity",
			render: value => <NumText as="s1" type="error" num={value} />
		}
	];
	const defaultColumns1 = [
		{
			name: "操作人账号",
			code: "operator"
		},
		{
			name: "操作界面",
			code: "subType"
		},
		{
			name: "操作类型",
			code: "type"
		},
		{
			name: "操作事件",
			code: "action"
		},
		{
			name: "操作时间",
			code: "createTime"
		}
	];
	//供应商商品名称的渲染
	const goodsNameRender = (record, index) => {
		return (
			<div className={styles.goodsBox}>
				<div className={styles.goodsImg}>
					<CommonZjfImg img={record.supplierSkuImage} storeId={record.supplierId} />
				</div>
				<div className={styles.goodsContent}>
					<div className="textOverflowMultiTwo">{record.supplierSkuName}</div>
					<div className="textOverflowMultiOne">{record.supplierSkuSpec}</div>
					<div>
						<span>商品编码：</span>
						<span>{record.supplierSpuCode}</span>
					</div>
				</div>
			</div>
		);
	};
	return { defaultColumns, defaultColumns1 };
};
